<template>
  <div id="app">
    <bpmn-modeler
      ref="refNode"
      :xml="xml"
      :users="users"
      :groups="groups"
      :categorys="categorys"
      :is-view="false"
      @save="saveModeler"
    />
  </div>
</template>

<script>
import bpmnModeler from '../package/index'
import myRequest from '@/utils/myRequest'
import qs from 'qs'

export default {
  components: {

    bpmnModeler
  },
  data() {
    return {
      xml: '', // 后端查询到的xml
      users: [
        { name: '张三', id: 'zhangsan' },
        { name: '李四', id: 'lisi' },
        { name: '王五', id: 'wangwu' }
      ],
      groups: [
        { name: 'web组', id: 'web' },
        { name: 'java组', id: 'java' },
        { name: 'python组', id: 'python' }
      ],
      categorys: [
        { name: 'OA', id: 'oa' },
        { name: '财务', id: 'finance' }
      ]
    }
  },
  mounted() {
    this.getModelDetail()
  },
  methods: {
    getModelDetail() {
      //查询数据库 之前保存的流程  获取的是文件
      // fetch('api/activiti/startProcessInstance'
      // ).then(response => {
      //       return response.text()
      //     }).then(xml => {
      //   this.xml = xml
      // })

      fetch('api/activiti/queryHistory'
      ).then(response => {
        return response.text()
      }).then(xml => {
        this.xml = xml
      })



      //注释掉 默认查询的这个   别人的

/*      fetch('https://cdn.jsdelivr.net/gh/goldsubmarine/workflow-bpmn-modeler@master/src/Leave.bpmn20.xml'
      )
        .then(response => {
          return response.text()
        }).then(xml => {
          this.xml = xml
        })*/
    },
    async saveModeler(data) {
      console.log('看看是否保存',data)
      fetch('api/activiti/createDeploy',
          {
            method:"POST",
            mode: 'cors',
            headers: {
              'Content-Type': 'application/json'
            },
            body:JSON.stringify({
              'process': data.process,
              'svgContext': data.svg,
              'xmlContext': data.xml
            })
          }
      ).then(response => {
        return response.text()
      }).then(xml => {
        this.xml = xml
      })

    }
  }
}
</script>
<style lang="scss">
html, body, #app {
  // height: 650px;
  margin: 0;
}
</style>
